{extend name="../../base/view/common/base" /}
<!-- 主体 -->
{block name="body"}
<form class="layui-form p-4">
    <h3 class="pb-3">添加信息</h3>
    {if condition="($id == 0)"}

    <table class="layui-table layui-table-form" id="fenpei_box">
        <!--<tr>-->
            <!--<td class="layui-td-gray-2">客户</td>-->
            <!--<td>-->
                <!--<input type="text" name="client_name"  autocomplete="off" placeholder="客户"-->
                       <!--class="layui-input">-->
            <!--</td>-->
        <!--</tr>-->
        <!--<tr>-->
            <!--<td class="layui-td-gray-2">公司名称</td>-->
            <!--<td>-->
                <!--<input type="text" name="company_name" autocomplete="off" placeholder="请选择公司"-->
                       <!--class="layui-input">-->
                <!--&lt;!&ndash;<input type="hidden" name="company_id">&ndash;&gt;-->
            <!--</td>-->
        <!--</tr>-->
        <!--<tr id="flow_tr">-->
            <!--<td class="layui-td-gray">出证人<font>*</font></td>-->
            <!--<td>-->
                <!--<input type="text" name="battle_user_name" autocomplete="off" placeholder="请选择出证人" lay-verify="required"-->
                       <!--lay-reqText="出证人" class="layui-input picker-one" readonly><input type="hidden"-->
                                                                                        <!--name="battle_user_id" readonly>-->
            <!--</td>-->
        <!--</tr>-->
        <tr>
            <td class="layui-td-gray">类型<font>*</font></td>
            <td>
                <select name="busine_type" class="busine_type" lay-reqText="请选择社保情况">
                    <option value="">请选择类型</option>
                    <option value="1">付款单</option>
                    <!--<option value="2">收款单</option>-->
                </select>
            </td>
            <td class="layui-td-gray">开户行</td>
            <td>
                <input type="text" name="account_bank" value="" autocomplete="off"
                       lay-reqText="开户行" placeholder="开户行" class="layui-input">
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray">户名</td>
            <td>
                <input type="text" name="account_name" value="" autocomplete="off"
                       lay-reqText="户名" placeholder="户名" class="layui-input">
            </td>
            <td class="layui-td-gray">账号</td>
            <td>
                <input type="text" name="account_no" value="" autocomplete="off"
                       lay-reqText="账号" placeholder="账号" class="layui-input">
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray">总计<font>*</font></td>
            <td>
                <input type="text" name="total_money" lay-verify="required" value="" autocomplete="off"
                       lay-reqText="总计" placeholder="总计" class="layui-input">
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray">费用类型</td>
            <td>
                <select name="pay_type" lay-reqText="请选择付款类型">
                    <option value="">请选择费用类型</option>
                    <option value="3">佣金</option>
                    <option value="4">中转费</option>

                </select>
            </td>
        </tr>
        <tr>
            <td class="layui-td-gray">说明</td>
            <td colspan="6">
                <textarea name="desc" placeholder="请输入说明" class="layui-textarea"></textarea>
            </td>
        </tr>
        <tr>
            <td colspan="6"><strong>相关文件（多附件格式）</strong></td>
        </tr>
        <tr>
            <td class="layui-td-gray">
                <button type="button" class="layui-btn layui-btn-sm" id="uploadBtn"><i class="layui-icon"></i>相关文件上传
                </button>
            </td>
            <td colspan="5" style="line-height:inherit">
                <div class="layui-row" id="fileBox">
                    <input type="hidden" id="fileBoxInput" data-type="file" name="file_ids" value="">
                </div>
            </td>
        </tr>

    </table>
    {else/}
    <table class="layui-table layui-table-form" id="fenpei_box">
            <!--<tr>-->
                <!--<td class="layui-td-gray-2">客户</td>-->
                <!--<td>-->
                    <!--<input type="text" name="client_name" value="{$detail.client_name}" autocomplete="off" placeholder="客户"-->
                           <!--class="layui-input">-->
                <!--</td>-->
            <!--</tr>-->
            <!--<tr>-->
                <!--<td class="layui-td-gray-2">公司名称</td>-->
                <!--<td>-->
                    <!--<input type="text" name="company_name" value="{$detail.company_name}" autocomplete="off" placeholder="请选择公司"-->
                           <!--class="layui-input">-->
                    <!--&lt;!&ndash;<input type="hidden" name="company_id">&ndash;&gt;-->
                <!--</td>-->
            <!--</tr>-->
            <!--<tr id="flow_tr">-->
                <!--<td class="layui-td-gray">出证人<font>*</font></td>-->
                <!--<td>-->
                    <!--<input type="text" name="battle_user_name" value="{$detail.battle_user_name}"  autocomplete="off" placeholder="请选择出证人" lay-verify="required"-->
                           <!--lay-reqText="出证人" class="layui-input picker-one" readonly><input type="hidden"-->
                                                                                            <!--name="battle_user_id" readonly>-->
                <!--</td>-->
            <!--</tr>-->
            <tr>
                <td class="layui-td-gray">类型<font>*</font></td>
                <td>
                    <select name="busine_type" id="busine_type" lay-reqText="请选择社保情况">
                        <option value="">请选择类型</option>
                        <option value="1" <?php if($detail['busine_type'] == 1) echo 'selected' ?>>付款单</option>
                        <!--<option value="2" <?php if($detail['busine_type'] == 2) echo 'selected' ?>>收款单</option>-->
                    </select>
                </td>
                <td class="layui-td-gray">开户行</td>
                <td>
                    <input type="text" name="account_bank" value="{$detail.account_bank}"  value="" autocomplete="off"
                           lay-reqText="开户行" placeholder="开户行" class="layui-input">
                </td>
            </tr>
            <tr>
                <td class="layui-td-gray">户名</td>
                <td>
                    <input type="text" name="account_name" value="{$detail.account_name}" autocomplete="off"
                           lay-reqText="户名" placeholder="户名" class="layui-input">
                </td>
                <td class="layui-td-gray">账号</td>
                <td>
                    <input type="text" name="account_no" value="{$detail.account_no}" autocomplete="off"
                           lay-reqText="账号" placeholder="账号" class="layui-input">
                </td>
            </tr>
            <tr>
                <td class="layui-td-gray">总计<font>*</font></td>
                <td>
                    <input type="text" name="total_money" value="{$detail.total_money}"  autocomplete="off"
                           lay-reqText="总计" placeholder="总计" class="layui-input">
                </td>
            </tr>
            <tr>
                <td class="layui-td-gray">费用类型</td>
                <td>
                    <select name="pay_type" lay-reqText="请选择付款类型">
                        <option value="">请选择费用类型</option>
                        <option value="3" <?php if($detail['pay_type'] == 3) echo 'selected' ?>>佣金</option>
                        <option value="4" <?php if($detail['pay_type'] == 4) echo 'selected' ?>>中转费</option>

                    </select>
                </td>
            </tr>
            <tr>
                <td class="layui-td-gray">说明</td>
                <td colspan="6">
                    <textarea name="desc" placeholder="请输入说明" class="layui-textarea">{$detail.desc}</textarea>
                </td>
            </tr>
            <tr>
                <td colspan="6"><strong>相关文件（多附件格式）</strong></td>
            </tr>
            <tr>
                <td colspan="5" style="line-height:inherit">
                    <div class="layui-row" id="fileBox">
                        <input type="hidden" data-type="file" name="file_ids" value="{$detail.file_ids}">
                        {notempty name="$detail.file_ids"}
                        {volist name="$detail.fileArray" id="vo"}
                        <div class="layui-col-md4" id="uploadImg{$vo.id}">{:file_card($vo)}</div>
                        {/volist}
                        {/notempty}
                    </div>
                </td>
            </tr>
        {notempty name="$detail.certs"}
        {volist name="$detail.certs" id="vo"}
        <tr>
            <td class="layui-td-gray-2">人员</td>
            <td><input name="names[]"  type="text" value="{$vo.name}" class="layui-input"></td>
            <td class="layui-td-gray-2">金额</td>
            <td><input name="moneys[]"  type="text" value="{$vo.money}" class="layui-input"></td>
            <td class="layui-td-gray-2">说明</td>
            <td><input name="descs[]"  type="text" value="{$vo.desc}" class="layui-input"></td>
            <td class="layui-td-gray-2">操作</td>
            <td class="layui-inline"><input type="button" value="删除+" class="layui-input del-cert"></td>
            <td><input name="bitjob_ids[]"  type="hidden" value="{$vo.bitjob_id}"></td>
        </tr>
        {/volist}
        {/notempty}
        </table>
    {/if}

    <div>
        <input type="text"  value="添加证书+"
               class="layui-input bitjob-picker">
    </div>
    <div class="py-3">
        <input name="id" id="id" type="hidden" value="{$id}">
        <button class="layui-btn layui-btn-normal" lay-submit="" lay-filter="webform">立即提交</button>
        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
    </div>
</form>
{/block}
<!-- /主体 -->

<!-- 脚本 -->
{block name="script"}
<script>
    const moduleInit = ['tool', 'employeepicker', 'oaTool'];

    function gouguInit() {
        var form = layui.form, tool = layui.tool, table = layui.table, laydate = layui.laydate, oaTool = layui.oaTool,
            employeepicker = layui.employeepicker;

        laydate.render({
            elem: '#reg_date',
            showBottom: false
        });

        laydate.render({
            elem: '#reg_valid_date',
            showBottom: false
        });

        //相关附件上传
        oaTool.addFile();
        $('.del-cert').on('click', function () {
            $(this).parent().siblings().remove();
            $(this).parent().remove();
            $(this).remove();
        });
        // var busine_type = '';
        // $('.busine_type').change(function () {
        //     busine_type = $(this).val();
        //     alert(busine_type);
        // });
        //选择关联的人才
        $('.bitjob-picker').on('click', function () {

            let that = $(this);
            let callback = function (data) {
                var fenpei_box = '<tr>';
                fenpei_box+='<td class="layui-td-gray-2">人员</td>';
                fenpei_box+='<td><input name="names[]"  type="text" value="'+data.salesman_name+'" class="layui-input"></td>';
                fenpei_box+='<td class="layui-td-gray-2">金额</td>';
                fenpei_box+='<td><input name="moneys[]"  type="text" value="'+data.money+'" class="layui-input"></td>';
                fenpei_box+='<td class="layui-td-gray-2">说明</td>';
                fenpei_box+='<td><input name="descs[]"  type="text" value="" class="layui-input"></td>';
                fenpei_box+='<td class="layui-td-gray-2">操作</td>';
                fenpei_box+='<td class="layui-inline">';
                fenpei_box+='<input type="button" value="删除+" class="layui-input del-cert">';
                fenpei_box+='</td>';
                fenpei_box+='<td><input name="bitjob_ids[]"  type="hidden" value="'+data.id+'"></td>';
                fenpei_box+='</tr>';
                $("#fenpei_box").append(fenpei_box);
                $('.del-cert').on('click', function () {
                    $(this).parent().siblings().remove();
                    $(this).parent().remove();
                    $(this).remove();
                });
            }
            oaTool.bitjobPicker(callback);
        });

        //选择关联的公司
        $('.license-picker').on('click', function () {
            let that = $(this);
            let callback = function (data) {
                $('[name="company_name"]').val(data.company_name);
                $('[name="company_id"]').val(data.id);
            }
            oaTool.licensePicker(callback);
        });
        //radio选择
        form.on('radio(tax)', function (data) {
            if (data.value == 0) {
                $('[name="tax"]').val('0').hide();
            } else {
                $('[name="tax"]').val('').show();
            }
        });

        //监听提交
        form.on('submit(webform)', function (data) {

            let callback = function (e) {
                layer.msg(e.msg);
                if (e.code == 0) {
                    tool.sideClose(1000);
                }
            }
            tool.post("/bitjob/putpay/add", data.field, callback);
            return false;
        });

        form.on('select(flowtype)', function (data) {
            var check_type = data.elem[data.elem.selectedIndex].title;
            var formHtml = '<td class="layui-td-gray">出证人<font>*</font></td>\
		<td colspan="5">\
			<input type="text" name="battle_user_name" value="" autocomplete="off" placeholder="请选择出证人" lay-verify="required" lay-reqText="请选择出证人" class="layui-input picker-one"><input type="hidden" name="battle_user_id" value="">\
		</td>';
            if (check_type == 2) {
                $('#flow_tr').html(formHtml);
                form.render();
            }
            if (data.value == '') {
                $('#flow_tr').html(formHtml);
                $('[name="copy_names"]').val('');
                $('[name="copy_uids"]').val('');
                form.render();
                return false;
            }
            $.ajax({
                url: "/api/index/get_flow_users",
                type: 'get',
                data: {id: data.value},
                success: function (e) {
                    if (e.code == 0) {
                        var flowLi = '';
                        var flow_data = e.data.flow_data;
                        if (e.data.copy_uids && e.data.copy_uids != '') {
                            $('[name="copy_names"]').val(e.data.copy_unames);
                            $('[name="copy_uids"]').val(e.data.copy_uids.split(','));
                        }
                        if (check_type == 1 || check_type == 3) {
                            for (var a = 0; a < flow_data.length; a++) {
                                var userList = '', sign_type = '';
                                if (check_type == 1) {
                                    if (flow_data[a].flow_type == 1) {
                                        userList += '<li style="padding:3px 0">当前部门负责人</li>';
                                    }
                                    else if (flow_data[a].flow_type == 2) {
                                        userList += '<li style="padding:3px 0">上级部门负责人</li>';
                                    }
                                    else {
                                        if (flow_data[a].flow_type == 3) {
                                            sign_type = ' <span class="layui-badge layui-bg-blue">或签</span>';
                                        }
                                        if (flow_data[a].flow_type == 4) {
                                            sign_type = ' <span class="layui-badge layui-bg-blue">会签</span>';
                                        }
                                        for (var b = 0; b < flow_data[a].user_id_info.length; b++) {
                                            userList += '<li style="padding:3px 0"><img src="' + flow_data[a].user_id_info[b].thumb + '" style="width:24px; height:24px; border-radius:50%; margin-right:8px;" />' + flow_data[a].user_id_info[b].name + '</li>';
                                        }
                                    }
                                }
                                else if (check_type == 3) {
                                    sign_type = ' <span class="layui-badge layui-bg-blue">' + flow_data[a].flow_name + '</span>'
                                    for (var b = 0; b < flow_data[a].user_id_info.length; b++) {
                                        userList += '<li style="padding:3px 0"><img src="' + flow_data[a].user_id_info[b].thumb + '" style="width:24px; height:24px; border-radius:50%; margin-right:8px;" />' + flow_data[a].user_id_info[b].name + '</li>';
                                    }
                                }
                                flowLi += '<li class="layui-timeline-item">\
								<i class="layui-icon layui-timeline-axis">&#xe63f;</i>\
								<div class="layui-timeline-content">\
								  <p class="layui-timeline-title"><strong>第' + (a + 1) + '级审批</strong>' + sign_type + '</p>\
								  <ul>' + userList + '</ul>\
								</div>\
							</li>';
                            }
                            formHtml = '<td class="layui-td-gray">审批流程</td>\
									<td colspan="7">\
										<ul id="flowList" class="layui-timeline">' + flowLi + '</ul>\
									</td>';
                            $('#flow_tr').html(formHtml);
                        }
                    }
                }
            })
        });
    }
</script>
{/block}
<!-- /脚本 -->